		<div class="row">
	    <div class="col-xs-12">
        <div class="box box-primary">
          <div class="box-header">
            <h3 class="box-title">Tambah Data Peserta</h3>
          </div><!-- /.box-header -->
          <?php echo form_open('kepesertaan_peserta/save', array('role' => 'form', 'id' => 'form', 'enctype' => 'multipart/form-data'));?>
          <div class="box-body">				        
            <!-- text input -->
            <div class="row">
            	<div class="col-sm-6">
            		<div class="form-group">
							    <label>NIK</label>
							    <span class="pull-right" id="cek_nik">
							    	<a href="#" onClick="return nik()">
							    		<i class="glyphicon glyphicon-check" style="color: #3C8DBC"></i>
							    	</a>
							    </span>
						      <input class="form-control input-sm" name="nik" id="nik" type="text" placeholder="Nomer Induk Kependudukan">
							  </div>
		            <div class="form-group">
							    <label>Nama</label>
						      <input class="form-control input-sm" name="nama" id="nama" type="text" placeholder="Nama Peserta">
							  </div>
							  <div class="form-group">
							    <label>Tempat Lahir</label>
						      <input class="form-control input-sm" name="tempat_lahir" id="tempat_lahir" type="text" placeholder="Tempat Lahir">
							  </div>
							  <div class="form-group">
							    <label>Tanggal Lahir</label>
						      <input class="form-control input-sm" name="tgl_lahir" id="tgl_lahir" type="text" placeholder="Tanggal Lahir">
							  </div>
							  <div class="form-group">
							    <label>Jenis Kelamin</label>
						      <select class="form-control input-sm" name="jk" id="jk">
						      	<option value=""> - - Pilih Jenis Kelamin - -</option>
						      	<option value="L">Laki-laki</option>
						      	<option value="P">Perempuan</option>
						      </select>
							  </div>
							  <div class="form-group">
							    <label>Golongan Darah</label>
						      <select class="form-control input-sm" name="golongan_darah" id="golongan_darah">
						      	<option value=""> - - Pilih Golongan Darah - - </option>
						      	<option value="O">O</option>
						      	<option value="A">A</option>
						      	<option value="B">B</option>
						      	<option value="AB">AB</option>
						      </select>
							  </div>
							  <div class="form-group">
							    <label>Nama Ibu</label>
						      <input class="form-control input-sm" name="ibu" id="ibu" type="text" placeholder="Nama Ibu">
							  </div>
							  <div class="form-group">
							    <label>Nama Ayah</label>
						      <input class="form-control input-sm" name="ayah" id="ayah" type="text" placeholder="Nama Ayah">
							  </div>
							  <div class="form-group">
							    <label>Agama</label>
						      <select class="form-control input-sm" name="agama" id="agama">
						      	<option value=""> - - Pilih Agama - - </option>
						      	<?php
						      		foreach ($agama as $value) {
						      			echo "<option value='".$value['id_agama']."'>".$value['agama']."</option>";
						      		}
						      	?>
						      </select>
							  </div>
							  <div class="form-group">
							    <label>Status Nikah</label>
						      <select class="form-control input-sm" name="status_nikah" id="status_nikah">
						      	<option value=""> - - Pilih Status Nikah - - </option>
						      	<?php
						      		foreach ($status_nikah as $value) {
						      			echo "<option value='".$value['id_status_nikah']."'>".$value['status_nikah']."</option>";
						      		}
						      	?>
						      </select>
							  </div>
	            </div>
	            <div class="col-sm-6">
	            	<div class="form-group">
							    <label>Pendidikan</label>
						      <select class="form-control input-sm" name="pendidikan" id="pendidikan">
						      	<option value=""> - - Pilih Pendidikan - - </option>
						      	<?php
						      		foreach ($pendidikan as $value) {
						      			echo "<option value='".$value['id_pendidikan']."'>".$value['pendidikan']."</option>";
						      		}
						      	?>
						      </select>
							  </div>
							  <div class="form-group">
							    <label>Pekerjaan</label>
						      <select class="form-control input-sm" name="pekerjaan" id="pekerjaan">
						      	<option value=""> - - Pilih Pekerjaan - - </option>
						      	<?php
						      		foreach ($pekerjaan as $value) {
						      			echo "<option value='".$value['id_pekerjaan']."'>".$value['pekerjaan']."</option>";
						      		}
						      	?>
						      </select>
							  </div>
							  <div class="form-group">
							    <label>SHDK</label>
						      <select class="form-control input-sm" name="shdk" id="shdk">
							      <option value=""> - - Pilih SHDK - - </option>
							      <?php
						      		foreach ($shdk as $value) {
						      			echo "<option value='".$value['id_shdk']."'>".$value['shdk']."</option>";
						      		}
						      	?>
						      </select>
							  </div>
							  <div class="form-group">
							    <label>Nomer Kartu Keluarga</label>
							    <span class="pull-right" id="cek_nik">
							    	<a href="#" onClick="return kd_kk()">
							    		<i class="glyphicon glyphicon-check" style="color: #3C8DBC"></i>
							    	</a>
							    </span>
						      <input class="form-control input-sm" name="kd_kk" id="kd_kk" type="text" placeholder="Nomer Kartu Keluarga">
							  </div>
							  <div class="form-group">
							    <label>Alamat</label>
						      <input class="form-control input-sm" name="alamat" id="alamat" type="text" placeholder="Alamat">
							  </div>
							  <div class="form-group">
							    <label>RT</label>
						      <input class="form-control input-sm" name="rt" id="rt" type="text" placeholder="RT">
							  </div>
							  <div class="form-group">
							    <label>RW</label>
						      <input class="form-control input-sm" name="rw" id="rw" type="text" placeholder="RW">
							  </div>
							  <div class="form-group">
							    <label>Kelurahan</label>
						      <select class="form-control input-sm" name="kelurahan" id="kelurahan">
						      	<option value=""> - - Pilih Kelurahan - - </option>
						      	<?php
						      		foreach ($kelurahan as $value) {
						      			echo "<option value='".$value['kd_kelurahan']."'>".$value['kelurahan']."</option>";
						      		}
						      	?>
						      </select>
							  </div>
							  <div class="form-group">
							    <label>Jenis Peserta</label>
						      <select class="form-control input-sm" name="jenis_peserta" id="jenis_peserta">
							      <option value=""> - - Pilih Jenis Peserta - - </option>
							      <?php
						      		foreach ($jenis_peserta as $value) {
						      			echo "<option value='".$value['id_jenis_peserta']."'>".$value['jenis_peserta']."</option>";
						      		}
						      	?>
						      </select>
							  </div>
							  <div class="form-group">
							    <label>Foto</label>
							    <a data-toggle="modal" href="#myModal">
							    	<span class="pull-right">
							    		<i class="glyphicon glyphicon-camera" style="color: #3C8DBC"></i>
							    	</span>
							    </a>
						      <input name="foto" type="file">
							  </div>
	            </div>
	          </div>
          </div>		                   
          <div class="box-footer">
            <button type="submit" class="btn btn-sm btn-primary btn-flat"><i class="fa fa-floppy-o"></i> Simpan</button>
          </div>
					<?php echo form_close();?>
        </div><!-- /.box -->                            
	    </div>

		  <!-- Modal -->
		  <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
		    <div class="modal-dialog">
		      <div class="modal-content">
		        <div class="modal-header">
		          <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
		          <h4 class="modal-title">Ambil Foto</h4>
		        </div>
		        <div class="modal-body">
		          ...
		        </div>
		        <div class="modal-footer">
		          <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
		          <button type="button" class="btn btn-primary">Capture</button>
		        </div>
		      </div><!-- /.modal-content -->
		    </div><!-- /.modal-dialog -->
		  </div><!-- /.modal -->

		</div>

		<script>
		$("#form").validate({
			rules: {
				nik: {
					required: true
				},
				nama: {
					required: true
				},
				tempat_lahir: {
					required: true
				},
				tanggal_lahir: {
					required: true
				},
				jk: {
					required: true
				},
				agama: {
					required: true
				},
				status_nikah: {
					required: true
				},
				pendidikan: {
					required: true
				},
				pekerjaan: {
					required: true
				},
				shdk: {
					required: true
				},
				kd_kk: {
					required: true
				},
				alamat: {
					required: true
				},
				kelurahan: {
					required: true
				},
				ibu: {
					required: true
				},
				ayah: {
					required: true
				},
				jenis_peserta: {
					required: true
				},
			}
		});
		</script>

		<script type="text/javascript">
		  function nik(){
				var send_data = {
						nik: $("#nik").val(),
						<?php echo $this->security->get_csrf_token_name(); ?>: "<?php echo $this->security->get_csrf_hash(); ?>",
					};

				$.ajax({
					type: "POST",
					url: "<?php echo base_url() ?>kepesertaan_peserta/get_penduduk",
					data: send_data,
					cache: false,
					dataType: 'json',
					success: function(msg){
						if($("#nama").val(msg.nama) != ''){
							$("#nama").val(msg.nama);
							$("#tempat_lahir").val(msg.tempat_lahir);
							$("#tgl_lahir").val(msg.tgl_lahir);
							$("#jk").val(msg.jk);
							$("#golongan_darah").val(msg.golongan_darah);
							$("#agama").val(msg.agama);
							$("#status_nikah").val(msg.status_nikah);
							$("#pendidikan").val(msg.pendidikan);
							$("#pekerjaan").val(msg.pekerjaan);
							$("#shdk").val(msg.shdk);
							$("#ibu").val(msg.ibu);
							$("#ayah").val(msg.ayah);
							$("#kd_kk").val(msg.kd_kk);
							$("#alamat").val(msg.alamat);
							$("#rt").val(msg.rt);
							$("#rw").val(msg.rw);
							$("#kelurahan").val(msg.kelurahan);
						}else{
							$("#nama").val(msg.nama);
							$("#tempat_lahir").val(msg.tempat_lahir);
							$("#tgl_lahir").val(msg.tgl_lahir);
							$("#jk").val(msg.jk);
							$("#agama").val(msg.agama);
							$("#status_nikah").val(msg.status_nikah);
							$("#pendidikan").val(msg.pendidikan);
							$("#pekerjaan").val(msg.pekerjaan);
							$("#shdk").val(msg.shdk);
							$("#ibu").val(msg.ibu);
							$("#ayah").val(msg.ayah);
						}
					}
				});
			}

			function kd_kk(){
				var send_data = {
						kd_kk: $("#kd_kk").val(),
						<?php echo $this->security->get_csrf_token_name(); ?>: "<?php echo $this->security->get_csrf_hash(); ?>",
					};

				$.ajax({
					type: "POST",
					url: "<?php echo base_url() ?>kepesertaan_peserta/get_keluarga",
					data: send_data,
					cache: false,
					dataType: 'json',
					success: function(msg){
						if(msg.kd_kk != ''){
							$("#alamat").val(msg.alamat);
							$("#rt").val(msg.rt);
							$("#rw").val(msg.rw);
							$("#kelurahan").val(msg.kelurahan);
							document.getElementById('alamat').readOnly = true;
							document.getElementById('rt').readOnly = true;
							document.getElementById('rw').readOnly = true;
							document.getElementById('kelurahan').disabled = true;
						}else{
							document.getElementById('alamat').readOnly = false;
							document.getElementById('rt').readOnly = false;
							document.getElementById('rw').readOnly = false;
							$("#alamat").val(msg.alamat);
							$("#rt").val(msg.rt);
							$("#rw").val(msg.rw);
							$("#kelurahan").val(msg.kelurahan);
						}
					}
				});
			}
		</script>

		<script type="text/javascript">
      $(document).ready(function(){
        $('#tgl_lahir').datepicker({
          dateFormat: "dd/mm/yy",
          changeMonth: true,
          changeYear: true
        });
      });
    </script>